﻿{% extends "base.html" %}
{% block title %}我的日记本{% endblock %}
{% block styles %}{{super()}}
<link href="{{ url_for("static", filename="css/dashboard.css") }}" rel="stylesheet">
<style>
    .col-center-block {
        float: none;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }
</style>
{% endblock %}
{% block scripts %}{{super()}}

<script>
    holidays = JSON.parse({{ holidays | tojson | safe}});
    holidaysOffset = JSON.parse({{ holidaysOffset  | tojson | safe}});

</script>
{#<script src="{{ url_for("static", filename="js/holidays.js") }}"></script>#}
<script src="{{ url_for("static", filename="js/mycalendar.js") }}"></script>
<script>
    var initialLocaleCode = 'zh-cn';
    $.each($.fullCalendar.locales, function (localeCode) {
        $('#locale-selector').append(
            $('<option/>')
                .attr('value', localeCode)
                .prop('selected', localeCode == initialLocaleCode)
                .text(localeCode)
        );
    });
    $(function () {
        var subcategories;
        subcategories = $('#subcategory').html();
        $('#subcategory').empty();
        return $('#category').change(function () {
            var category, options;
            category = $('#category :selected').html();
            options = $(subcategories).filter("optgroup[label='" + category + "']").html();
            if (options) {
                return $('#subcategory').html(options);
            } else {
                return $('#subcategory').empty();
            }
        });
    });
    $(function () {
        var subcategories;
        subcategories = $('#subcategory2').html();
        $('#subcategory2').empty();
        return $('#category2').change(function () {
            var category, options;
            category = $('#category2 :selected').html();
            options = $(subcategories).filter("optgroup[label='" + category + "']").html();
            if (options) {
                return $('#subcategory2').html(options);
            } else {
                return $('#subcategory2').empty();
            }
        });
    });
    $(function () {
        $('.datepicker').datepicker({
            format: 'mm/dd/yyyy',
            startDate: '-3d',
            todayBtn: true,
            todayHighlight: true
        });
    });

    // download current calendar
    $(function () {
        $("#download-dept").click(function () {
            var date = new Date($('#calendar').fullCalendar('getDate'));
            var month = date.getMonth() + 1;
            var year = date.getYear() + 1900;
            var para = '?year=' + year.toString() + '&month=' + month.toString();
            window.location.href = "{{ url_for('bp_plot.dept')}}" + para;
        });
        $("#download-user").click(function () {
            var date = new Date($('#calendar').fullCalendar('getDate'));
            var month = date.getMonth() + 1;
            var year = date.getYear() + 1900;
            var para = '?year=' + year.toString() + '&month=' + month.toString();
            window.location.href = "{{ url_for('bp_plot.user')}}" + para;
        });
    });
</script>
{% endblock %}


{% block content %}
{% include 'event_modal.html' %}
<div class="container-fluid">
    <div class="main">
        <div class="row">
            <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 col-center-block">
                {% include 'flash_message.html' %}
                <h4 class="row page-header">
                    <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12" style="text-align:left">
                        <div type="button" class="btn btn-default" id="download-dept">部门报表</div>
                        <div type="button" class="btn btn-default" id="download-user">个人报表</div>
                    </div>
                    <p class="col-xs-12 col-sm-12 col-md-12 col-lg-120">
                        <div id="manhourSummary" style="text-align:center"></div>
                    </p>
                </h4>
                <div>
                    <div id='calendar'></div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}